<template>
  <div>
    <div class="successImg">
        <hd-svg-icon name="hd-duihao" size="100px" color="#333333" style="margin-top:3px"  ></hd-svg-icon>
    </div>
    <div class="successTitle">
        订单支付成功
    </div>
    <p class="content">支付成功后会在[我的]中查看到您订单的详细内容,稍后将有短信发送到您的手机,请注意查收!</p>
    <div class="buttonGroup">
        <yd-button-group>
            <yd-button size="large" type="primary" @click.native="findOrderInfo">查看订单详情</yd-button>
        </yd-button-group>
    </div>
    <div class="buttonGroup" style="margin-top:10px">
        <yd-button-group>
            <yd-button size="large" type="hollow" @click.native="continueOrder">继续预定</yd-button>
        </yd-button-group>
    </div>
  </div>
</template>

<script>

export default {
  name: 'order_success_line',
  data() {
    return {
      bot: {
        'position': 'fixed',
        'bottom': '1rem'
      },
      orderCode: this.$route.query.orderCode
    }
  },
  mounted() {
    this.load();
    // 判断浏览器类型 打开方式是否是微信浏览器方式打开
    var ua = window.navigator.userAgent.toLowerCase()
    if (ua.match(/MicroMessenger/i) == 'micromessenger') {
      this.bot = {
        'position': 'fixed',
        'bottom': '0'
      };
    } else {
    }
  },
  methods: {
    load() {
      alert(this.orderCode);
    },
    findOrderInfo() {
      this.$router.push({'path': 'boutiqueline_order_info', query: {'orderCode': this.orderCode}});
    },
    continueOrder() {
      if (this.orderCode.indexOf('A') === 0) {
        this.$router.push({'path': '/blueindex', query: {}});
      } else if (this.orderCode.indexOf('H') === 0) {
        this.$router.push({'path': '/liveindex', query: {}});
      } else if (this.orderCode.indexOf('L') === 0) {
        this.$router.push({'path': 'boutiquelineindex', query: {}});
      }
      // this.$router.push({'path': 'boutiquelineindex', query: {}});
    }
  }
}
</script>

<style>
  body {
    height: 100%;
    overflow: hidden;
    background-color: #ffffff;
  }
  .successImg{
    text-align: center;
    padding-top: 20px;
    padding-bottom: 30px;
  }
  .successTitle{
    font-size: 20px;
    text-align: center;
    height: 30px;
  }
  .content{
    text-align: center;
  }
  .buttonGroup{
    margin-top: 40px;
  }
</style>